<!--流程测试-->
<template>
  <section>
    <br />
    <el-form :model="form" ref="form" :rules="FormRules">
      <div style="border: 1px solid #e6e6e6;margin-bottom: 10px;padding:15px">
        <el-row :gutter="15">
          <el-col :span="8">
            <el-form-item
              label="所属项目:"
              label-width="83px"
              prop="getProjectFirstID"
            >
              <el-select
                v-model="form.getProjectFirstID"
                placeholder="请选择项目列表"
                @change="getInterface"
              >
                <el-option
                  v-for="(item, index) in project"
                  :key="index + ''"
                  :label="item.project_name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              label="验证环境:"
              label-width="83px"
              prop="getEnvironmentFirstID"
            >
              <el-select
                v-model="form.getEnvironmentFirstID"
                placeholder="请选择验证环境"
                required="true"
              >
                <el-option
                  v-for="(item, index) in env"
                  :key="index + ''"
                  :label="item.env_name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </div>

      <el-row :span="22">
        <div>
          <el-row>
            <el-col :span="10">
              <div style="margin: 5px">
                <el-row :span="10"> </el-row>
              </div>
              <el-table
                :data="runPlan"
                highlight-current-row
                :class="add"
                @selection-change="selsChange"
              >
                <el-table-column type="selection" min-width="5%">
                </el-table-column>
                <el-table-column label="接口id" min-width="14%">
                  <template slot-scope="scope">
                    <span class="over-content">{{ scope.row.id }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="接口名称"
                  min-width="15%"
                  :show-overflow-tooltip="true"
                >
                  <template slot-scope="scope">
                    <span class="over-content">{{
                      scope.row.interface_name_zh
                    }}</span>
                  </template>
                </el-table-column>
                <el-table-column label="选择执行用例" min-width="18%">
                  <template slot-scope="scope">
                    <!--只有选中并且count不为0时，按钮 才能勾选
                     scope.row.existenceCount 0:数量为0   1:数量不为0
                     此数据是在选择完项目后，根据获取的数据追加获得

                    -->
                    <el-button
                      :disabled="
                        scope.row.existenceCount === 0 ||
                          sels.map((item) => item.id).indexOf(scope.row.id) ==
                            -1
                      "
                      plain
                      type="warning"
                      size="small"
                      @click="handleSelected(scope.$index, scope.row)"
                      >选择</el-button
                    >
                  </template>
                </el-table-column>

                <el-table-column
                  :show-overflow-tooltip="true"
                  label="用例id"
                  min-width="14%"
                >
                  <template slot-scope="scope">
                    <span class="over-content">{{ scope.row.caseID }}</span>
                  </template>
                </el-table-column>

                <el-table-column
                  :show-overflow-tooltip="true"
                  label="用例名称"
                  min-width="14%"
                >
                  <template slot-scope="scope">
                    <span class="over-content">{{ scope.row.caseName }}</span>
                  </template>
                </el-table-column>

                <!-- <el-table-column label="疏通测试数量" min-width="14%">
                  <template slot-scope="scope">
                    <span class="over-content">{{ scope.row.count0 }}</span>
                  </template>
                </el-table-column> -->
                <!--<el-table-column label="逻辑测试数量" min-width="14%">
                  <template slot-scope="scope">
                    <span class="over-content">{{ scope.row.count1 }}</span>
                  </template>
                </el-table-column>-->
                <el-table-column label="mock" min-width="14%">
                  <template slot-scope="scope">
                    <el-checkbox
                      :checked="
                        sels.map((item) => item.id).indexOf(scope.row.id) == 0
                      "
                      @change="subProj(scope.row)"
                      :disabled="
                        sels.map((item) => item.id).indexOf(scope.row.id) == -1
                      "
                    >
                    </el-checkbox>
                  </template>
                </el-table-column>
              </el-table>
              <el-col :span="24" class="toolbar">
                <el-pagination
                  layout="prev, pager, next"
                  @current-change="handleCurrentChange"
                  :page-size="20"
                  :page-count="total"
                  style="float:right;"
                >
                </el-pagination>
              </el-col>
            </el-col>

            <el-col :span="6">
              <div id="app" :span="6">
                <br />
                <div class="prompt">执行顺序</div>
                <br />
                <br />
                <ul
                  :style="{ width: widthnum }"
                  @dragstart="onDragStart"
                  @dragover="onDragOver"
                  @dragend="onDragEnd"
                  ref="parentNode"
                >
                  <li
                    display:block
                    v-for="(item, index) in dragData"
                    :key="index"
                    class="item"
                    draggable="true"
                  >
                    {{ item }}
                  </li>
                </ul>
                <br /><br />

                <!--
                  执行按钮隐藏

                  341:114,342:120,

                  this.runSign  0不可运行



                -->
                <el-button
                  class="return-list"
                  type="primary"
                  :disabled="this.sels.length === 0 || this.runSign === 0"
                  style="float: left; margin-left: 50px"
                  @click.native="run"
                  >执行</el-button
                >
              </div>
            </el-col>
          </el-row>
        </div>
      </el-row>
      <el-dialog
        customClass="customWidth"
        title="选择执行用例"
        :visible.sync="selectCaseFormVisible"
        :close-on-click-modal="true"
      >
        <!-- 
          
              :beforeClose="handleCancel"
          
          v-for="(item, index) in project"
                  :key="index + ''"
                  :label="item.project_name"    :span="12"
                  :value="item.id" -->
        <!-- <el-checkbox v-for="item in items" :label="item.id" :key="item.id">{{item.case_name}}</el-checkbox> -->

        <div style="height:100px;">
          <el-form :model="form" ref="form">
            <el-col>
              <el-form-item
                label="选择用例:"
                label-width="120px"
                prop="selectCase"
              >
                <el-select
                  v-model="form.selectCase"
                  placeholder="请选择要执行的用例"
                  @change="changeCase"
                  style="width: 300px"
                >
                  <el-option
                    v-for="(item, index) in this.select_case_all"
                    :key="index + ''"
                    :label="item.id + '_' + item.case_name"
                    :value="item.id"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-form>
        </div>

        <!-- <input type='radio' :name=''  :checked='option.checked'>{{option.text}} -->
      </el-dialog>
    </el-form>
  </section>
</template>

<script>
import { test } from "../../../../api/api";

import {
  // getApiListByProjectID,
  ProcesstTesting, //流程测试
  getCasebyApiID,
  getProjectList,
  // getModelList,
  getEnvironmentList,
  // getCaseTypeList,
  getApplicationList,
  createScript,
} from "../../../../api/api";
export default {
  data() {
    return {
      currentApiID: "",
      currentApirow: "",
      getApiAndCase: "",

      selectCaseFormVisible: false,
      widthnum: "45%",
      dragData: [],
      dragDataStr: "",
      draging: null, // 被拖拽的对象
      target: null, // 目标对象
      select_case_all: [],
      radioData: [],
      runSign: 0, //运行标志    0不可运行 1可运行
      // items: [],

      runArr: [],

      radio3: "0",
      total: 0,
      page: 1,
      runPlan: [],
      checkmock: false,
      listLoading: false,
      sels: [], //列表选中列
      mockArr: [],
      mockList: [],
      model: [],
      checkboxT1: false,
      checkboxT2: true,

      project: [],
      //生成脚本
      createScriptBox: false,
      generateScriptFrom: {
        application: "",
        scriptName: "",
      },

      radioType: "3",
      caseType: "3",
      result: true,

      id: "",
      request3: false,
      selectable: false,
      flag: true,
      //aaaa:true,
      form: {
        getProjectFirstID: "",
        selectCase: "",

        getEnvironmentFirstID: "",
        // getCaseTypeFirstID: "",
        getModelFirstID: "",
        interface_name_zh: "",
        interface_name_en: "",
        status: true,

        data: "",
      },
      FormRules: {},
    };
  },
  methods: {
    cellcb(row) {
      if (row.row.checkStatus === 1 && row.columnIndex === 0) {
        return "myCell";
      }
    },

    handleCurrentChange(val) {
      this.page = val;
      this.getInterfaceChangePage();
    },

    radioChange(val) {
      this.radio3 = val;
    },

    /***获取运行接口列表---翻页事件
     ****/
    getInterfaceChangePage() {
      let self = this;

      let param = {
        project_id: Number(self.form.getProjectFirstID),
        page: self.page,
      };

      $.ajax({
        type: "get",
        url: test + "/api/api/getInterfaceByProjectId",
        async: true,
        data: param,
        headers: {
          Authorization: "Token " + JSON.parse(sessionStorage.getItem("token")),
        },
        timeout: 5000,
        success: function(data) {
          console.log("yiyiyiyiiyiyiyiyiyiyiy");
          // debugger;
          if (data.code === "999999") {
            // debugger;
            self.total = data.total;

            self.runPlan = data.data.data.map((x) => {
              x.caseId = "";
              x.caseName = "";
              return x;
            });

            // var arr=[]
            // for(i=0;i<data.data.data.length;i++)
            //   this.array.push({data.data.data[i],})
          } else {
            self.$message.error({
              message: data.msg,
              center: true,
            });
          }
        },
      });
    },

    /***获取运行接口列表---change下拉框事件**/
    getInterface(value) {
      //let params = { page: self.page, env_name: self.filters.env_name};

      let self = this;

      let param = { project_id: value, page: self.page };

      $.ajax({
        type: "get",
        url: test + "/api/api/getInterfaceByProjectId",
        async: true,
        data: param,
        headers: {
          Authorization: "Token " + JSON.parse(sessionStorage.getItem("token")),
        },
        timeout: 5000,
        success: function(data) {
          var data_plan = data.data.data;

          var data_plan_all = [];

          if (data.code === "999999") {
            self.total = data.total;
            for (var i = 0; i < data_plan.length; i++) {
              data_plan[i]["mock_status"] = 0;

              /***
              此处用于获取接口对应的用例数量，当所有数量均为0则existenceCount=0
              数量大于0 则existenceCount=1
              方便控制选择执行用例的按钮操作
              */
              if (
                data_plan[i]["count0"] > 0 ||
                data_plan[i]["count1"] > 0 ||
                data_plan[i]["count2"] > 0 ||
                data_plan[i]["count3"] > 0
              ) {
                data_plan[i]["existenceCount"] = 1;
                data_plan[i]["caseId"] = "";
                data_plan[i]["caseName"] = "";
              } else {
                data_plan[i]["existenceCount"] = 0;
                data_plan[i]["caseId"] = "";
                data_plan[i]["caseName"] = "";
              }

              data_plan_all.push(data_plan[i]);
            }

            self.runPlan = data_plan_all;
          } else {
            self.$message.error({
              message: data.msg,
              center: true,
            });
          }
        },
      });
    },

    run: function() {
      let ids = this.sels.map((item) => item.id);

      var mock_arrcl = this.mockArr; //mockArr处理

      var idscl = []; //ids处理
      for (var i = 0; i < ids.length; i++) {
        if (mock_arrcl.indexOf(ids[i]) > -1) {
          //则包含该元素
          idscl.push(ids[i] + "|1");
        } else {
          idscl.push(ids[i] + "|0");
        }
      }
      console.log(idscl); //mock数据

      let self = this;
      this.$confirm("确认执行选中的接口吗？", "提示", {
        type: "warning",
      }).then(() => {
        this.listLoading = true;

        let self = this;
        let params = {
          run_ids: [idscl],
          run_seq: [this.dragDataStr],
          run_ac: [this.getApiAndCase],
          project_id: Number(self.form.getProjectFirstID),
          environment_id: Number(self.form.getEnvironmentFirstID),
          case_type_code_id: self.radio3,
        };

        let header = {
          "Content-Type": "application/json",
          Authorization: "Token " + JSON.parse(sessionStorage.getItem("token")),
        };
        ProcesstTesting(header, params).then((_data) => {
          let { msg, code, data } = _data;

          if (code === "999999") {
            var result_message = data[0].msg;
            result_message = JSON.parse(result_message);

            var resultMessage = "项目名称:" + result_message.项目名称 + ",";
            var resultMessage =
              resultMessage + "环境名称:" + result_message.环境名称 + ",";
            var resultMessage =
              resultMessage + "本批次:" + result_message.本批次 + ",";
            var resultMessage =
              resultMessage +
              "共执行接口数量:" +
              result_message.共执行接口数量 +
              ",";
            var resultMessage =
              resultMessage +
              "执行成功数量:" +
              result_message.执行成功数量 +
              ",";
            var resultMessage =
              resultMessage + "执行失败数量:" + result_message.执行失败数量;

            const confirmText = [
              "项目名称:" + result_message.项目名称,
              "环境名称:" + result_message.环境名称,
              "本批次:" + result_message.本批次,
              "共执行接口数量:" + result_message.共执行接口数量,
              "执行成功数量:" + result_message.执行成功数量,
              "执行失败数量:" + result_message.执行失败数量,
            ];

            const newDatas = [];
            const h = this.$createElement;
            for (const i in confirmText) {
              newDatas.push(h("p", null, confirmText[i]));
            }
            this.$confirm("提示", {
              // title:'执行详情如下',
              message: h("div", null, newDatas),
              showCancelButton: false,
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "info",
            })
              .then(() => {
                self.$router.push({
                  path: "/echarts_report/pici=" + result_message.本批次,
                });
              })
              .catch(() => {});
          } else {
            self.$message.error({
              message: msg,
              center: true,
            });
          }
        });
      });
    },

    getApplication() {
      let self = this;
      let headers = {
        "Content-Type": "application/json",
        Authorization: "Token " + JSON.parse(sessionStorage.getItem("token")),
      };
      let params = "";
      getApplicationList(headers, params).then((_data) => {
        let { msg, code, data } = _data;
        if (code === "999999") {
          self.generateScriptFrom.application = data;
        } else {
          self.$message.error({
            message: msg,
            center: true,
          });
        }
      });
    },

    handleSelected: function(index, row) {
      // this.currentApirow = null;

      setTimeout(() => {
        this.$forceUpdate();
      }, 100);

      this.currentApirow = row;

      /***构建查询参数
       let param = { interfaceId: row.id };
       根据接口id查询用例内容
       */
      // let param = { interfaceId: row.id };
      // console.log(param);
      this.currentApiID = row.id;

      let params = { interfaceId: row.id };
      let headers = {
        Authorization: "Token " + JSON.parse(sessionStorage.getItem("token")),
      };
      getCasebyApiID(headers, params).then((_data) => {
        self.listLoading = false;
        let { msg, code, data } = _data;
        //打开弹窗
        if (code === "999999") {
          this.select_case_all = [];
          this.select_case_all = data.data;

          self.cases = this.select_case_all;
        } else {
          self.$message.error({
            message: msg,
            center: true,
          });
        }
      });
      this.selectCaseFormVisible = true;
      this.form.selectCase = ""; //重点  为了使dialog每次打开select内容都是空的
      setTimeout(() => {
        this.$forceUpdate();
      }, 100);
      console.log(1);
      console.log(this.select_case_all);
      /****g */
    },

    getArrEqual(arr1, arr2) {
      //对比arr
      let newArr = [];
      for (let i = 0; i < arr2.length; i++) {
        for (let j = 0; j < arr1.length; j++) {
          if (arr1[j] === arr2[i]) {
            newArr.push(arr1[j]);
          }
        }
      }
      return newArr;
    },

    // checkRunSign() {},

    //左侧的checklist列

    selsChange: function(sels, index) {
      console.log("case+api");
      // console.log(this.getApiAndCase);
      // console.log(sels);

      // var AC=this.getApiAndCase   //Api和Case缩写
      // console.log("AC")
      // console.log(AC)
      // console.log(AC.length)
      // 遍历list
      // for(var i=0;i<AC.length;i++){
      //   console.log("AC[i]")
      //   console.log(AC[i]);

      // }

      //  for (var j = 0; j < sels.length; j++) {
      //     var selid;
      //     selid = sels[j].id;
      //     console.log("勾选的ID")
      //     console.log(selid)

      //  }

      let id_check_disable = this.sels.map((item) => item.id);
      var selids = [];

      var dragDatas = [];

      for (var j = 0; j < sels.length; j++) {
        var selid;
        selid = sels[j].id;
        selids.push(selid);
        console.log("selids");
        console.log(selids);

        var dragName;
        dragName = sels[j].interface_name_zh;
        var dragIdAndName;
        dragIdAndName = selid + "--" + dragName;
        console.log(dragIdAndName);
        dragDatas.push(dragIdAndName);
      }
      // console.log(1111111111);
      // console.log(this.dragData);
      // console.log(selids); dragData
      this.dragData = dragDatas;

      console.log(22222);
      console.log(this.dragData);
      var x = ""; //字符串
      for (var j = 0; j < this.dragData.length; j++) {
        console.log(this.dragData[j]);
        // var index=dragData[j].indexOf("--")
        // var obj = this.dragData[j].substring(0, index);
        // console.log(obj)
        console.log("b");
        this.dragData[j];
        x = x + this.dragData[j] + "!@#$%^&*";
      }
      console.log(1111111111111);
      console.log(x);
      this.dragDataStr = x;
      console.log("AAAA");
      console.log(this.dragDataStr);
      /****下面是 id-接口名 拼接 */

      /****下面是mock */

      var mockList = this.mockArr;
      var newList = [];
      newList = this.getArrEqual(selids, mockList); //取出选择接口的数组和mock选中的数组的共同元素的方法

      this.mockList = newList;
      console.log(mockList);

      this.sels = sels;

      console.log("AAAAAAAAAAAA");
      console.log(sels);

      //重新循环左侧勾选 如果没有选择用例并反显id则直接return，且不执行

      for (var j = 0; j < sels.length; j++) {
        var selid;
        selid = sels[j].id;

        var checkCaseID;
        checkCaseID = sels[j].caseID;
        console.log("CCCCCC");
        console.log(checkCaseID);

        var check1 = "test" + checkCaseID;
        console.log(check1);

        if (checkCaseID == undefined) {
          var var1 = 0;
          console.log("zou undefined");
        } else {
          var var1 = 1;
          console.log("buzou undefined");
          console.log(checkCaseID);

          console.log(1);
        }
        this.runSign = var1;
        console.log("BBBBBBBBB");
        console.log(this.runSign);
      }
    },

    isJsonString(str) {
      try {
        if (typeof JSON.parse(str) === "object") {
          return true;
        }
      } catch (e) {}
      return false;
    },

    subProj: function(row, index) {
      if (this.mockArr == "") {
        var mockList = [];
        mockList.push(row.id);
        this.mockArr = mockList;
        row.mock_status = 1;
      } else {
        var mockList = this.mockArr;
        if (mockList.indexOf(row.id) > -1) {
          //则包含该元素
          const removeArr = [row.id];
          mockList = mockList.filter((a) => !removeArr.includes(a));
          this.mockArr = mockList;
          row.mock_status = 0;
        } else {
          mockList.push(row.id);
          this.mockArr = mockList;
          row.mock_status = 1;
        }
      }
    },

    handleResponseEdit: function(index, row) {
      this.id = index;

      //this.editForm = Object.assign({}, row);
    },

    // demo  下拉菜单从数据库取值
    getProjects() {
      let self = this;
      let params = {
        project_id: this.$route.params.project_id,
      };
      let headers = {
        "Content-Type": "application/json",
        Authorization: "Token " + JSON.parse(sessionStorage.getItem("token")),
      };
      getProjectList(headers, params).then((_data) => {
        let { msg, code, data } = _data;
        if (code === "999999") {
          var projectjsonArr = new Array();

          for (var i = 0; i < data.length; i++) {
            if (data[i].status == 0) {
              projectjsonArr.push(data[i]);
            }
          }

          self.project = projectjsonArr;
        } else {
          self.$message.error({
            message: msg,
            center: true,
          });
        }
      });
    },

    environments() {
      let self = this;
      let params = {
        project_id: this.$route.params.project_id,
      };
      let headers = {
        "Content-Type": "application/json",
        Authorization: "Token " + JSON.parse(sessionStorage.getItem("token")),
      };
      getEnvironmentList(headers, params).then((_data) => {
        let { msg, code, data } = _data;
        if (code === "999999") {
          self.env = data;
          console.log(self.env);

          self.form.getEnvironmentFirstID = self.env[0].id;
        } else {
          self.$message.error({
            message: msg,
            center: true,
          });
        }
      });
    },

    cellcb(index) {
      // txt.style.display = "none";
      //this.form.responseList.splice(index, 1);

      if (index.row.checkStatus === 1 && index.row.columnIndex === 0) {
        return "myCell";
      }
    },

    handleChange(val) {},

    /*****拖拽开始 */
    onDragStart(event) {
      this.draging = event.target;
    },
    onDragOver(event) {
      this.target = event.target;
      const targetTop = event.target.getBoundingClientRect().top;
      const dragingTop = this.draging.getBoundingClientRect().top;
      if (this.target.nodeName === "LI" && this.target !== this.draging) {
        if (this.target) {
          if (this.target.animated) {
            return;
          }
        }
        if (this._index(this.draging) < this._index(this.target)) {
          this.target.parentNode.insertBefore(
            this.draging,
            this.target.nextSibling
          );
        } else {
          this.target.parentNode.insertBefore(this.draging, this.target);
        }
        this._anim(targetTop, this.target);
        this._anim(dragingTop, this.draging);
      }
    },
    onDragEnd(event) {
      const currentNodes = Array.from(this.$refs.parentNode.childNodes);

      const dragData = currentNodes.map((i, index) => {
        const item = this.dragData.find((c) => c === i.innerText);
        return item;
      });

      var x = ""; //字符串
      for (var j = 0; j < dragData.length; j++) {
        x = x + dragData[j] + "!@#$%^&*"; //拼接用于后续处理，这里的特殊字符组成的字符串防止重复导致出错，减少简单的，-等造成的数据错误
      }

      this.dragDataStr = x;
    },

    changeCase(value) {
      //更改选中case

      // let selectedWorkName = {};
      //  selectedWorkName = this.select_case_all.find((item)=>{//这里的chargingWorkNameList就是上面遍历的数据源
      //      return item.chargingWorkId === value;
      //      //筛选出匹配数据，是对应数据的整个对象
      //  });
      let _this = this;
      Vue.nextTick(function() {
        let obj = {};
        obj = _this.select_case_all.find((item) => {
          return item.id === value;
        });
        console.log(obj);

        var name = obj.case_name;

        console.log(name);

        var buildJson = "";
        buildJson = "" + (_this.currentApiID + ":" + value + ",");

        console.log(buildJson);
        var jsonData = _this.getApiAndCase;
        jsonData = jsonData + buildJson;
        _this.getApiAndCase = jsonData;
        _this.selectCaseFormVisible = false;
        _this.currentApirow["caseID"] = value;
        _this.currentApirow["caseName"] = name;
        console.log(7777);
        console.log(_this.currentApirow);

        // this.runPlan[this.currentRow] = this.popupData

        // this.$forceUpdate();
        // this.$set(this.runPlan);

        // this.currentApirow = null;

        //选择用例后判断是否可执行

        //重新循环左侧勾选 如果没有选择用例并反显id则直接return，且不执行

        var sels = _this.sels;

        for (var j = 0; j < sels.length; j++) {
          var selid;
          selid = sels[j].id;

          var checkCaseID;
          checkCaseID = sels[j].caseID;

          var check1 = "test" + checkCaseID;

          if (checkCaseID == undefined) {
            var var1 = 0;
          } else {
            var var1 = 1;
          }
          _this.runSign = var1;
        }
        console.log("!!!!!!!!!!!");
        console.log(_this.runPlan);

        // runArr

        // this.$forceUpdate();
      });
      //******************zhongdian */
    },
    _anim(startPos, dom) {
      const offset = startPos - dom.getBoundingClientRect().top;
      dom.style.transition = "none";
      dom.style.transform = `translateY(${offset}px)`;

      // 触发重绘
      // eslint模式下必须添加下面这行注释
      // eslint-disable-next-line no-unused-expressions
      dom.offsetWidth;
      dom.style.transition = "transform .3s";
      dom.style.transform = ``;
      // 触发重绘
      // setTimeout(()=>{
      //     dom.style.transition="transform .3s";
      //     dom.style.transform=``;
      // },0)
      clearTimeout(dom.animated);

      dom.animated = setTimeout(() => {
        dom.style.transition = "";
        dom.style.transform = ``;
        dom.animated = false;
      }, 300);
    },

    _index(el) {
      const domData = Array.from(this.$refs.parentNode.childNodes);
      return domData.findIndex((i) => i.innerText === el.innerText);
    },
    /*****拖拽结束 */
  },

  watch: {
    // this.runPlan
  },
  mounted() {
    // 为了防止火狐浏览器拖拽的时候以新标签打开，此代码真实有效
    (document.body.ondrop = function(event) {
      event.preventDefault();
      event.stopPropagation();
    }),
      this.getProjects();
    this.environments();

    // this.getCaseType();
  },
};
</script>
<!--style 样式-->
<style lang="scss" scoped>
.return-list {
  margin-top: 0px;
  margin-bottom: 10px;
  border-radius: 25px;
}
.head-class {
  font-size: 17px;
}
.parameter-a {
  display: block;
}
.parameter-b {
  display: none;
}
.selectInput {
  position: absolute;
  /*margin-left: 7px;*/
  padding-left: 9px;
  width: 180px;
  /*border-radius:0px;*/
  /*height: 38px;*/
  left: 1px;
  border-right: 0px;
}
.customWidth {
  width: 80%;
}
</style>

<style>
.myCell .el-checkbox__input {
  display: none;
}
.over-content {
  width: 80;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.color-red {
  color: red;
  border: 1px solid #e8e8e8;
  padding: 0px 6px 0 9px;
  margin-right: 23px;
}
</style>

<style scoped>
ul {
  list-style-type: decimal;
  /* list-style: none; */
  padding-bottom: 10px;
  list-style-position: inside;
}
.item {
  cursor: pointer;
  /* height: 30px;
line-height: 30px; */
  padding: 10px 0;
  background-color: RGB(0, 130, 217);
  border: 1.8px solid white;
  border-radius: 4px;
  color: #fff;
  font-size: 10px;
  padding: 10px;
}
.prompt {
  /* background: yellow; */
  float: left;
  width: 45%;
  font-family: "宋体";
  font-size: 15px;
  font-weight: bold;

  text-align: center; /*让文字水平居中*/
}

.el-dialog {
  /* padding:100px; */
  border-top: 10px solid #dcdfe6;
  border-bottom: 10px solid #dcdfe6;
  max-height: calc(100vh - 281px);
  overflow-y: auto;
}
</style>
